یادداشت کن لذت ببر

قدم اول

دیدن source برنامه:

برای فهم کار و لایه های مختلف یک وبسایت می بایست ابتدا شکل کلی تگهای یک وبسایت واقعی رو ببینید. این کار باعث فهم موضوع است و سرعت یادگیری شما را افزایش می دهد. برای اینکار وارد یک سایت شوید و روی هر جایی غیر از عکس کلیک راست کنید و سپس گزینه ی آخر Source را بزنید تا صفحه ای مانند صفحه ی زیر به نمایش در آید.

خوب عناصر اصلی HTML عبارتند از :

یک تگ DOCTYOE

تگ HTML

تگ HEAD

تگ TITLE 

تگ BODY

و این یک نمونه کد فقط شامل تگ های اصلی می باشد .

حال میخواهیم با تک تک این عناصر آشنا شویم: 

تگ DOCTYPE : Document Type Definition

اولین تگ صفحه ی وب بدون فاصله . این یک قانون است

همانطور که word 2007 در 2000 دچار مشکل میشود HTMLها هم با DOCTYPE های متفاوت نمایش متفاوت در مرورگرها دارند.

در واقع این داک تایپ است که به مرورگر میگوید این سند چه نوع سندی است و باید به چه ترتیب Render شود.نحوه ی رندر شدن و تفاوت آنها باید در سطوح حرفه ای تری بیان شود.

 داک تایپ ها هم مانند word و .. در حال پیشرفتند یعنی هر مدت ورژن جدیدتری از آنها ارائه می شود.

برای دیدن داک تایپ های موجود به آدرس زیر بروید:

Http://refrence.sitepoint.com/html/Doctype

به داک تایپ زیر دقت کنید:

-"DOCTYPE HTML PUBLIC W3C//DTD// HTML 5.0 STRICT//EN!>

<"HTTP://WWW.W3C.ORG/TR/XHTML"

ما در این خط می گوییم که نوع سند چیست و آدرسی که باید به این نوع سند در وبسایت کنسرسیوم جهانی وب world wide web consortium یا w3c اشاره کند کدام است.

در حال حاضر دو نوع داک تایپ استفاده بیشتری دارند Transitional وStrict .

همانطور که گفتم دنبال تفاوت این داک تایپ ها نباشید.

تاکید میکنم داک تایپ اولین آیتم صفحه وب است بدون فاصله.

عناصر HTML:

قبل از اینکه عناصر HTML را شرح دهم باید با مفهوم تگ (tag) آشنا شوید . تگ یعنی اسمی که میان این دو <> باشد و نام تگ همان متنی است که بین این دو قرار <> میگیرد.

تگHTML>            HTML>

    تگHEAD>         HEAD>

 تگ ها می توانند شامل چند Attribute  (ویژگی) باشند :

HTML>

"XMLNS="HTTP://WWW.W3C.ORG/1999/XHTML

<"DIR="RTL

Dir نام یک attribute است و rtl. value مقدار ان است که بین "" قرار گرفته است.

تگ ها به دو دسته ی Container و Empty تقسیم می شوند.تگ Container شامل یک تگ بازشونده و یک تگ بسته شونده است.تگهای Empty متفاوت هستند مانند تگ زیر:

 <"IMG SRC="IMAGES/TEST.JPG" ALT="TEST>

تگ های Empty را میتوان به صورت Container استفاده کرد ولی در داک تایپ هایxhtml توصیه شده تگ های Emptyبه همان صورتEmpty استفاده شوند.

در استفاده از تگها باید بدانید از چه نوعی هستند تا سند شما دچار ارور نشود به عنوان مثال اگر تگ div را به صورت Empty به کار ببرید دچار errorمی شود.

 نگران نباشید برای فهم بهتر تگ های Empty  بیایید عبارت زیر را در گوگل جستجو کنیم : Empty tag in Html

بسیار عالی نتایج به صورت زیر است: 

</Br>

</Hr >

</Meta>

..

دوستان هیچ وقت دنیای وب و جستجو را فراموش نکنید . 

به غیر از داک تایپ ها تمامی عناصر صفحه داخل تگ Html است که شامل دو بخش می شود Body و head.

این یک تگ Container است و در بالای سند قبل از تگ body است و شامل اطلاعاتی درباره ی صفحه است مانند Css, meta, title.  

;CONTENT="TEXT/HTML>

<"CHARSET=UTF-8  

یک تگ Container است که متن وسط آن در بالای صفحه "عنوان" یا Title سایت شماست .

موارد استفاده title:

1-برای معرفی صفحه است در واقع عنوان صفحه است.

2-برای موتورهای جستجو و سئوی وبسایت مورد اهمیت است.

متا تگ یک تگ Empty است و برای دلایل متفاوتی استفاده می شوند از جمله اطلاعات اضافی که در مرورگر نمایش داده نمیشوند.برای مثال نان نویسنده ؛ حق کمی رایت ؛ و ... Css و java script هم در تگ هدHead استفاده می شوند.

عنصر Body:

هر آنچه در body قرار می گیرد را می توان در خروجی دید . تیترها ، پاراگراف ها ،  تصاویر و ...

در قسمت بعدی به طور عملی با هم یک وبسایت می سازیم.!

نظرات شما عزیزان:

نام :

آدرس ایمیل:

وب سایت/بلاگ :

متن پیام:

نظر خصوصی

 کد را وارد نمایید:

 

 

 

عکس شما

آپلود عکس دلخواه: